import React from 'react'
import Header from './components/Header'
import ThemeMode from './components/ThemeMode'
import Footer from './components/Footer'
import Vod from './utils/Vod'
// import Att from "./utils/Att"
// import { RouterProvider } from 'react-router-dom'
// import routes from './router'
// const useViewportScale=(designWidth=1920)=>{
//   const [scale,setScale]=useState(1)
//   useEffect(()=>{
//     const handl=()=>{
//       const viewWidth=window.innerWidth;
//       setScale(viewWidth/designWidth)
//     }
//     handl()
//     window.addEventListener('resize',handl)
//     return ()=>{
//       window.removeEventListener('resize',handl)
//     }
//   },[designWidth])
//   return scale
// }
function App() {
  // const scale=useViewportScale()



  return <div className='big'>
    {/* <RouterProvider router={routes}></RouterProvider> */}

    <div className='header'>
      <Header />
      <ThemeMode/>
    </div>
    <div className='content'>
      <div className='threeD'>
{/* <Att/> */}
      </div>
      <div className='vidio'>
        <Vod />
      </div>
    </div>
    <div className='footer'>

      <Footer />
    </div>
  </div>

}

export default App
